/**
 * Created by MingRi on 2017/1/17.
 * @author:bjzhang
 */

import React,{Component} from 'react';

import {
    View,
    Text,
    StyleSheet,
    TextInput
} from 'react-native';
import PHead from '../module/header';
import { common } from '../module/common';
import Toast from 'react-native-root-toast';
import Spinner from 'react-native-spinkit';
import renderIf from "../module/renderIf";
export default class AddImageText extends Component{
    constructor(props){
        super(props);
        // console.log(this);
        // this.props.params = this.props.navigation.state;
        // console.log(this);
        // {this.props.navigation.state.params.media.uri}
        this.state = {
            content:'',
            opacity:.5,
            isVisible:false
        };
    }
    componentDidMount(){
        var that = this;
    }
    send(){
        let { params } = this.props.navigation.state;
        let that = this, media = params.media,type = params.type;
        if(that.state.content && media) {
            that.setState({ isVisible:true });
            common.getLocation(function(location) {
                if (type == 1) {
                    common.uploadFile(common.api.file.upload.image, 'ImageText', media.uri).then(res => {
                        common.post(common.api.bag.image, {
                            image: res.url,
                            content: that.state.content,
                            lockType: 0,
                            longitude: location.longitude,
                            latitude: location.latitude,
                            location: location.address,
                            locked: 0,
                            thumbnail: res.thumbnail
                        }).then(res => {
                            Toast.show('发表成功', {
                                    duration: Toast.durations.SHORT,
                                    position: Toast.positions.BOTTOM,
                                    onHidden: () => {
                                        that.props.navigation.goBack();
                                    }
                                }
                            );
                        }).catch(err => {
                            Toast.show('发表失败', {
                                    duration: Toast.durations.LONG,
                                    position: Toast.positions.BOTTOM
                                }
                            );
                        }).finally(succ=>{
                            that.setState({ isVisible:false });
                        });
                    }).catch(err => {
                        that.setState({ isVisible:false });
                        Toast.show('图片上传失败', {
                                duration: Toast.durations.LONG,
                                position: Toast.positions.BOTTOM
                            }
                        );
                    });
                } else {
                    common.uploadFile(common.api.file.upload.video, 'VideoText', media.uri).then(res => {
                        common.post(common.api.bag.video, {
                            video: res.file,
                            cover: res.cover,
                            content: that.state.content,
                            lockType: 0,
                            longitude: location.longitude,
                            latitude: location.latitude,
                            location: location.address,
                            locked: 0,
                            thumbnail: res.thumbnail
                        }).then(res => {
                            Toast.show('发表成功', {
                                    duration: Toast.durations.SHORT,
                                    position: Toast.positions.BOTTOM,
                                    onHidden: () => {
                                        that.props.navigation.goBack();
                                    }
                                }
                            );
                        }).catch(err => {
                            Toast.show('发表失败', {
                                    duration: Toast.durations.LONG,
                                    position: Toast.positions.BOTTOM
                                }
                            );
                        }).finally(succ=>{
                            that.setState({ isVisible:false });
                        });;
                    }).catch(err => {
                        that.setState({ isVisible:false });
                        Toast.show('视频上传失败', {
                                duration: Toast.durations.LONG,
                                position: Toast.positions.BOTTOM
                            }
                        );
                    });
                }
            });
        }
    }
    back(){
        this.props.navigation.goBack();
    }
    changeText(text){
        this.setState({
            content:text,
            opacity:1
        });
    }
    render(){
        return(
            <View style={styles.container}>
                <PHead onBackEvent={this.back.bind(this)} onRightEvent={this.send.bind(this)} opacity={this.state.opacity} rightText='确定' leftText='关闭' title='留下点什么？'/>
                <View style={{ flex:1 }}>
                    <TextInput underlineColorAndroid='transparent'
                               placeholder='说点什么，最多可以输入150个字'
                               placeholderTextColor='rgba(94,99,131,0.50)'
                               maxLength={150}
                               numberOfLines={20}
                               keyboardType='default'
                               multiline={true} style={styles.textInput}
                               onChangeText={(text)=>this.changeText(text)}>
                    </TextInput>
                </View>
                {renderIf(this.state.isVisible)(
                    <View style={styles.loadingContainer}>
                        <Spinner isVisible={this.state.isVisible} size={30} type="Circle" color="rgba(0,0,0,.5)"/>
                    </View>
                )}
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container:{
        backgroundColor:'#fff',
        flex:1,
        flexDirection:'column',
        justifyContent:'space-between',
    },
    textInput:{
        fontSize:16,
        color:'rgb(95,100,132)',
        paddingTop:17,
        paddingLeft:20,
        paddingRight:20,
        textAlignVertical:'top',
    },
    loadingContainer:{
        position: "absolute",
        left: 0,
        top: 0,
        bottom: 0,
        right: 0,
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor:'rgba(0,0,0,.3)'
    }
});